<template>
    <view class="page">
        
        	<view class="popup-cont">
        		<view class="g-container g-nav-title">
        			<view>序号</view>
        			<view>购买折扣</view>
        			<view>价格</view>
        			<view class="handle">操作</view>
        		</view>
        		<scroll-view class="g-popup-content" scroll-y>
        			<view class="g-container g-line" v-for="(item,index) in data2" :key="index">
        				<view>{{index+1}}</view>
        				<view :style="{color: '#d61311'}">{{item.buy_discount/10 == 0?'免费':item.buy_discount/10+'折'}}</view>
        				<view>￥{{item.shop_price}}</view>
        				<view class="handle" v-if="item.is_accept==1 || item.is_accept==2">
								<text class="u-operate">{{item.operateText}}
									<text class="u-arrow"></text>
								</text>
        				</view>
						<view class="handle" v-if="item.is_accept==-1">
							<picker mode="selector" :range="item.is_draw ? range1 : range2" :data-index="index" @change="change">
								<text class="u-operate">{{item.operateText}}
									<text class="u-arrow"></text>
								</text>
							</picker>
						</view>
						<view class="handle" v-if="item.is_accept==0">
							<picker mode="selector" :range="item.is_draw ? range3 : range4" :data-index="index" @change="change">
								<text class="u-operate">{{item.operateText}}
									<text class="u-arrow"></text>
								</text>
							</picker>
						</view>
        			</view>
        		</scroll-view>
        		<view class="g-buy-detail">
        			<view class="title">合计:</view>
        			<view class="g-detail-left b-right">
        				<view>
        					<text>参团</text>
        					<text>¥{{total.price}}</text>
        				</view>
        				<view>
        					<text>发货</text>
        					<text>¥{{total.send}}</text>
        				</view>
        			</view>
        			<view class="g-detail-left">
        				<view>
        					<text>代售</text>
        					<text>¥{{total.daishou}}</text>
        				</view>
        				<view>
        					<text>总计</text>
        					<text>¥{{total.cancel}}</text>
        				</view>
        			</view>
        		</view>
        		<button class="u-popup-confirm" @tap="send">提交</button>
        	</view>
			<view class="m-full-loading" v-if="showloading">
			    <image src="../../static/images/loading.gif" mode="widthFix"></image>
			</view>
    </view>
</template>
<script>
    import henglang from '@/common/common.js';
    export default {
        data() {
            return {
			    data2: [], // 份数选择数据
				range1: ['发货', '委托代售'],
				range2: ['发货', '退货'],
				range3: ['待发货', '委托代售'],
				range4: ['待发货', '退货'],
			    value: '发货',
			    showloading: false,
			    sendData2: { // 请求商品份数选择发送的数据
			       team_id: 1,
			       data: []
			    },
			    total: { // 份数详情
			       price: 0,
			       daishou: 0,
			       send: 0,
			       cancel: 0,
			    }
            };  
        },
        methods: {
			
            calcTotal() { // 计算购买份数详情
				let price = 0; 		//参团(商品单价和)
				let daishou = 0;	//代售价格
				let send = 0;		//发货价格
				let cancel = 0;		//总计

				this.data2.forEach((item) => {
					price += parseFloat(item.shop_price);
					daishou += item.operateText == '委托代售' ? parseFloat(parseFloat((item.back_discount / 100) * item.shop_price).toFixed(2)) : 0;
					if(item.operateText == '发货'||item.operateText == '待收货'||item.operateText == '待发货'){
						send +=parseFloat(item.shop_price  * item.buy_discount /100);
					}else{
						send +=0;
					}
				})
				this.total.price = henglang.mathFormat(price,2);
				this.total.daishou = henglang.mathFormat(daishou,2);
				this.total.send = henglang.mathFormat(send,2);
				this.total.cancel = henglang.mathFormat(price - send,2);
			},
			change(e) { // 选框改变
			    let index = e.currentTarget.dataset.index;
			    let val = '';
			    let origin = this.data2;
				if(this.data2[index].is_accept==-1){
					if (this.data2[index].is_draw) {
					    val = this.range1[e.target.value];
					} else {
					    val = this.range2[e.target.value];
					}
				}else if(this.data2[index].is_accept==0){
					if (this.data2[index].is_draw) {
					    val = this.range3[e.target.value];
					} else {
					    val = this.range4[e.target.value];
					}
				}
			    
			    origin[index].operateText = val;
			    this.data2 = origin;
			    this.calcTotal();
			},
			send() { // 发送数据
			    let origin = [];
			    let that = this;
			    this.data2.forEach((item, index) => { // 字符串对应到action
			        let obj = {};
			        obj.id = item.id;
			        if (item.operateText == '发货' || item.operateText=='待发货') {
			            obj.action = 0;
			        }else if(item.operateText=='待收货'){
						obj.action = 1;
					}else{
						obj.action = 2;
					}
					origin.push(obj);
			    });
				this.sendData2.data = origin;
				that.showloading = true
				henglang.post('Order/discountToPay',that.sendData2,true,function(res){
					that.showloading = false
					if(res.data.code == 2){ //支付要发货的订单
						henglang.showToast(res.data.msg,500)
						setTimeout(() => {
							uni.redirectTo({
								url:"/pages/order/pay_discount?team_id="+that.sendData2.team_id
							})
						}, 500)
					}else if(res.data.code == 0){
						henglang.showToast(res.data.msg,500)
						setTimeout(() => {
							uni.redirectTo({
								url:'/pages/user/group_finish'
							})
						}, 500)
					}else{
						henglang.showToast(res.data.msg)
					}
				});
			}
        },
        onLoad({
			team_id
		}) {
			let that = this
			that.showloading = true;
			that.sendData2.team_id = Number(team_id);
			henglang.get('order/getDiscountLotteryList',{team_id: that.sendData2.team_id},true,function(res){
				that.showloading = false;
				res.data.data.forEach((item, index) => {
					if(item.is_accept==2)
						item.operateText='已退货'
					else if(item.is_accept==1)
						item.operateText='待收货'
					else if(item.is_accept==0)
						item.operateText='待发货'
					else if(item.is_accept==-1)
						item.operateText ='发货';
				});
				that.data2 = res.data.data;
				that.calcTotal();
			});
        }
    }
</script>

<style>
	.page{
		background: #ffffff;
	}
	.popup-cont{
		font-size: 30upx;
	}
	.g-nav-title{
		line-height: 50upx;
		width: 656upx;
		margin: 0 auto;
		margin-top: 44upx;
		margin-bottom: 10upx;
	}
	.g-container {
	    display: flex;
		text-align: center;
		align-items: center;
	}
	.g-container > view {
		width: 23%;
	}
	.g-container .handle{
		width: 31%;
	}
	.popup-cont .u-operate {
	    background: #f5f5f5;
	    padding: 4upx 28upx 4upx 10upx;
	    color: #707070;
	}
	.popup-cont .u-arrow {
	    display: inline-block;
	    border: 10upx solid;
	    border-color: #707070 transparent transparent transparent;
	    transform: translate(54%,26%);
	}
	.popup-cont .g-line {
		border-bottom: 1px solid #f5f5f5;
	}
	.popup-cont .g-popup-content {
		width: 656upx;
		margin: 0 auto;
		overflow: auto;
		height: 65vh;
	}
	.popup-cont .g-popup-content .g-container{
		height: 100upx;
	}
	.popup-cont .g-buy-detail {
		position: fixed;
		z-index: 10;
		bottom: 100upx;
		left: 0;
		width: 100%;
		height: 16vh;
	    border-top: 1px solid #dcdcdc;
		background: #ffffff;
	}
	.popup-cont .g-buy-detail .title{
		width: 100%;
		color: #d71511;
		font-weight: bold;
		position: relative;
		margin: 22upx 0 10upx 60upx;
	}
	.popup-cont .g-buy-detail .title:after{
		content: '';
		position: absolute;
		left: -30upx;
		top: 50%;
		margin-top: -15upx;
		width: 6upx;
		height: 30upx;
		background: #d71511;
	}
	.popup-cont .g-detail-left {
		float: left;
		font-size: 28upx;
		width: 230upx;
		position: relative;
	}
	.popup-cont .g-detail-left.b-right{
		padding-right: 40upx;
		padding-left: 20upx;
		margin: 0 40upx;
	}
	.popup-cont .g-detail-left.b-right:after{
		content: '';
		position: absolute;
		top: 50%;
		right: 0;
		background: #DCDCDC;
		width: 1px;
		height: 84upx;
		margin-top: -42upx;
	}
	.popup-cont .g-detail-left view{
		width: 100%;
		display: flex;
		justify-content: space-between;
		padding: 10upx 0;
	}
	.popup-cont .u-popup-confirm {
	    position: fixed;
		z-index: 10;
	    bottom: 0;
	    left: 0;
	    width: 100%;
	    height: 100upx;
		line-height: 100upx;
	    color: #fff;
	    background: #d71511;
	    text-align: center;
	}
</style>
